<template>
  <div class="box">{{ 1 + 1 }} {{ a }} + {{ b }} = {{ c }}</div>
  <div>
    <button @click="add">添加</button>
  </div>
</template>
<script>
import ZDog from './class/ZDog.class.js'
import { V2Dog } from './class/ZDog.class.js'
export default {
  data() {
    return {
      a: 1,
      b: 2,
      c: 3,
      d: 4
    }
  },
  methods: {
    add() {
      this.a++
      console.log(`helloworld`)
    }
  },
  mounted() {
    //bopi zhipi gao 2 level noadd 3
    console.log(`helloworld`)
    let dog = new V2Dog()
    const handler1 = (next) => {
      console.log(`叫1`)
      next()
    }
    dog.doSome(handler1)
    const handler = (next) => {
      console.log(`三秒后继续`)
      setTimeout(() => {
        let dog = new V2Dog()
        dog.doSome(function(next) {
          console.log(`子任务1`)
          next()
        })
        dog.doSome(function(next) {
          console.log(`子任务2`)
          next()
        })
        dog.doSome(next)
        dog.start()
      }, 3e3)
    }
    dog.doSome(handler)
    dog.doSome(function(next) {
      console.log(`三秒后继续1`)
      setTimeout(() => {
        next()
      }, 3e3)
    })
    dog.doSome(function(next) {
      console.log(`三秒后继续2`)
      setTimeout(() => {
        next()
      }, 3e3)
    })
    dog.doFirst(function(next) {
      console.log(`5秒后继续`)
      setTimeout(() => {
        next()
      }, 5e3)
    })
    dog.doSome(function(next) {
      console.log(`正常操作`)
    })

    dog.start()
  }
}
</script>
<style type="text/css">
.box {
  width: 100px;
  height: 100px;
  border: 1px solid #000;
}
</style>
